<style scoped>
  .status {
    padding: 30px 20px;
  }
  .status i {
    font-size: 90px;
    margin-bottom: 20px;
  }
  .text-center {
    text-align: center;
  }
  .tip{line-height: 20px;text-align: center;font-size: 12px;}
</style>
<template>
  <wrap title="审核详情" oneScreen>
    <div slot="page" class="light-bg" style="min-height:100%">
      <div class="status flex flex-col flex-justify-center flex-align-center">
        <i class="fa fa-check-circle green" aria-hidden="true" v-if="info.status.code==1"></i>
        <i class="fa fa-ban red" aria-hidden="true" v-if="info.status.code==3"></i>
        <i class="fa fa-check-circle-o green" aria-hidden="true" v-if="info.status.code==4"></i>
        <i class="fa fa-clock-o blue" aria-hidden="true" v-if="info.status.code==5"></i>
        <p class="font-16 text-center font-16">{{info.status.title}}</p>
        <p class="grey-6 margin-top" v-if="info.status.description" >{{info.status.description}}</p>
        <p class="grey-6 margin-top font-18"  v-if="(info.status.code === 1 || info.status.code === 4) && info.status.quota">￥&nbsp;<span class="font-30">{{info.status.quota}}</span></p>
      </div>
      <div v-if="info.status.code === 1" class="fill-btn-box">
        <a class="fill-btn flex flex-center red-bg" @click="getQuota()">
          <span class="light font-18">激活白条</span>
        </a>
      </div>
      <!-- <div v-if="info.status.code === 3" class="fill-btn-box">
        <a href='https://m.9ji.com/user/' class="fill-btn flex flex-center red-bg" >
          <span class="light font-18" >确定</span>
        </a>
      </div> -->
      <div v-if="info.status.code === 4" class="fill-btn-box">
        <a class="fill-btn flex flex-center red-bg" @click="toAccount">         
          <span class="light font-18">确认</span>
        </a>
      </div>
      <div v-if="info.status.code === 5" class="fill-btn-box">
        <a class="fill-btn flex flex-center red-bg" @click="reflesh">
          <span class="light font-18">刷新查看审核状态</span>
        </a>
        <p class="tip grey-9 padding" v-for="(p, i) in info.status.tips">{{p}}</p>
      </div>
    </div>
  </wrap>
</template>
<script>
  // -1、未签署签字签章
  // 0、填写资料页
  // 1、通过（领取额度）
  // 2、未通过（需补充资料人工审核）
  // 3、拒绝，请三个月后再试
  // 4、通过，获取额度
  // 5、审核中
  import wrap from '../../components/wrap.vue'
  export default {
    components: { wrap },
    data () {
      return {
        token: '',
        info: {
          status: {
            code: '',
            title: '',
            quota: '',
            description: '',
            tips: [
              '人工审核时间：09:00~21:30',
              '若长时间未能帮您处理，请致电人工客服进行咨询',
              '联系电话：88888888'
            ]
          }
        }
      }
    },
    created () {
      const self = this
      self.token = self.$store.state.token
      console.log(self.token)
      let signResult = self.$route.query.result_code
      if (signResult && signResult === '3001') {
        self.$router.push('/fill/signfail/')
      } else {
        self.fetchDate()
      }
    },
    methods: {
      fetchDate () {
        const self = this
        self.$Indicator.open()
        self.$api.detail.detail().then(res => {
          self.$Indicator.close()
          if (res.code === 0) {
            self.info.status = res.data
            // self.$MessageBox.alert(self.info.status.code)
            if (self.info.status.code === 0) {
              self.$router.replace('/')
            } else if (self.info.status.code === 2) {
              self.$router.replace('/detail/addition/?auditType=' + false)
            } else if (self.info.status.code === -1) {
              self.$router.replace('/fill/signfail/')
            }
          }
        }).always(function () {
          self.$Indicator.close()
        })
      },
      getQuota () {
        const self = this
        self.$router.push('/detail/addition/?auditType=' + true)
      },
      reflesh () {
        window.location.reload()
      },
      toAccount () {
        window.location.href = '/m/account'
      }
    }
  }
</script>